<w-loader ng-if="$ctrl.pending && !$ctrl.isDemo"></w-loader>

<w-smart-table ng-if="!$ctrl.pending || $ctrl.isDemo"
               class="smart-table"
               ng-class="{'my-trade-history': $ctrl.isMy}"
               data="$ctrl.history"
               header-info="$ctrl.headers">

    <w-empty-block ng-if="!$ctrl.history.length && !$ctrl.isDemo"></w-empty-block>

    <div class="sign-in-message" ng-if="$ctrl.isMy && $ctrl.isDemo">
        <a ng-if="$ctrl.userList.length > 0" ui-sref="signIn" class="link" w-i18n="directives.demo.signIn"></a>
        <a ng-if="$ctrl.userList.length === 0" ui-sref="welcome" class="link" w-i18n="directives.demo.signIn"></a>
        <span w-i18n="directives.demo.or"></span>
        <a ui-sref="create" class="link" w-i18n="directives.demo.createAccount"></a>
        <span w-i18n="directives.demo.to.tradehistory"></span>
    </div>

    <w-table-row ng-repeat="tx in $data track by tx.id"
                 class="footnote-1 basic-900 {{::tx.exchangeType}}">
        <w-table-cell ng-if="::$ctrl.isMy">
            <span ng-click="$ctrl.setPair(tx)" ng-class="{underline: !$ctrl.isSelected(tx) && ! $ctrl.isLockedPair(tx)}">
                <a class="to-dex-link" href="#">{{::tx.pair}}</a>
            </span>
        </w-table-cell>
        <w-table-cell>
            <span class="cell-label" w-i18n="directives.tradeHistory.tableTitle.exchangeType"></span>
            <span class="order-side {{::tx.exchangeType}}"
                  w-i18n="directives.tradeHistory.orderType.{{::tx.exchangeType}}"></span>
        </w-table-cell>
        <w-table-cell>
            <span class="cell-label" w-i18n="directives.tradeHistory.tableTitle.date"></span>
            {{::tx.timestamp | date:'MM-dd HH:mm:ss'}}
        </w-table-cell>
        <w-table-cell>
            <span class="cell-label" w-i18n="directives.tradeHistory.tableTitle.price"></span>
            <w-balance money="::tx.price" short-mode="::true"></w-balance>
        </w-table-cell>
        <w-table-cell>
            <span class="cell-label" w-i18n="directives.tradeHistory.tableTitle.size"></span>
            <w-balance money="::tx.amount" short-mode="::true"></w-balance>
        </w-table-cell>
        <w-table-cell>
            <span class="cell-label" w-i18n="directives.tradeHistory.tableTitle.total"></span>
            <w-balance money="::tx.total" short-mode="::true"></w-balance>
        </w-table-cell>
        <w-table-cell ng-if="$ctrl.isMy">
            <span class="cell-label" w-i18n="directives.tradeHistory.tableTitle.fee"></span>
            <span w-i18n="money-currency" params="::{money: tx.userFee}"></span>
        </w-table-cell>
    </w-table-row>
</w-smart-table>
